<template>
  <el-dialog title="销售数据详情" size="medium" :visible.sync="params.showInfo" width="90%" :before-close="handleClose">
    <div>
      <el-container>
        <el-header class="addsales-header">开票信息</el-header>
        <el-main class="addsales-main">
          <el-form :inline="true" size="medium" class="search-form" label-width="145px" style="padding-bottom: 10px;">
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="发据开票日期：">
                <div class="el-form-items">{{params.paramsData.billDate | filterDateForDay}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="发票代码：">
                <div class="el-form-items">{{params.paramsData.billCode||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="发票号码：">
                <div class="el-form-items">{{params.paramsData.billNo||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="发票金额(元)：">
                <div class="el-form-items">{{params.paramsData.billPrice||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="厂牌：">
                <div class="el-form-items">{{params.paramsData.billCarMark||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="号牌：">
                <div class="el-form-items">{{`${params.paramsData.billCarPlateHead}${params.paramsData.billCarPlateMiddle}${params.paramsData.billCarPlateCode}`}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="机动车发动机号：">
                <div class="el-form-items">{{params.paramsData.billCarEngineNo||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="机动车车架号：">
                <div class="el-form-items">{{params.paramsData.billCarVin||'无'}}</div>
              </el-form-item>
            </el-col>

            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="车辆名称：">
                <div class="el-form-items">{{params.paramsData.billCarName||'无'}}</div>
              </el-form-item>
            </el-col>

            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="车辆类型：">
                <div class="el-form-items">{{params.paramsData.carType.carTypeName||'无'}}</div>
              </el-form-item>
            </el-col>

            <div class="clearfix">
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="买方单位/个人：">
                  <div class="el-form-items">{{params.paramsData.billBuyerName||'无'}}</div>
                </el-form-item>
              </el-col>
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="单位代码/身份证号：">
                  <div class="el-form-items">{{params.paramsData.billBuyerNo||'无'}}</div>
                </el-form-item>
              </el-col>
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="买方单位/个人住址：">
                  <div class="el-form-items">{{params.paramsData.billBuyerAddress||'无'}}</div>
                </el-form-item>
              </el-col>
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="电话：">
                  <div class="el-form-items">{{params.paramsData.billBuyerMobile||'无'}}</div>
                </el-form-item>
              </el-col>
            </div>
            <div class="clearfix">
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="卖方单位/个人：">
                  <div class="el-form-items">{{params.paramsData.billSellerName||'无'}}</div>
                </el-form-item>
              </el-col>
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="单位代码/身份证号：">
                  <div class="el-form-items">{{params.paramsData.billSellerNo||'无'}}</div>
                </el-form-item>
              </el-col>
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="卖方单位/个人住址：">
                  <div class="el-form-items">{{params.paramsData.billSellerAddress||'无'}}</div>
                </el-form-item>
              </el-col>
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="电话：">
                  <div class="el-form-items">{{params.paramsData.billSellerMobile||'无'}}</div>
                </el-form-item>
              </el-col>
            </div>
            <div class="clearfix">
              <el-col :sm="24" :md="12" :lg="8" :xl="6">
                <el-form-item label="转入地车管所：">
                  <div class="el-form-items">{{params.paramsData.province && params.paramsData.province.provinceName}} {{params.paramsData.city && params.paramsData.city.cityName}}</div>
                </el-form-item>
              </el-col>
              <el-form-item label="备注：">
                <div class="el-form-itemt">{{params.paramsData.billRemark||'无'}}</div>
              </el-form-item>
            </div>
          </el-form>
        </el-main>
        <el-header class="addsales-header">开票补充信息</el-header>
        <el-main class="addsales-main">
          <el-form :inline="true" size="medium" class="search-form clearfix" label-width="145px" style="padding-bottom: 10px;">
            <div class="clearfix">
              <el-form-item label="品牌车系：">
                <div class="el-form-itemt">{{`${params.paramsData.brand.brandName} ${params.paramsData.series.seriesName} ${params.paramsData.model.modelName}`}}</div>
              </el-form-item>
            </div>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="车身颜色：">
                <div class="el-form-items">{{params.paramsData.billCarColor||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="所属市场：">
                <div class="el-form-items">{{params.paramsData.market.marketName||'无'}}</div>
              </el-form-item>
            </el-col>
            <el-col :sm="24" :md="12" :lg="8" :xl="6">
              <el-form-item label="所属商铺：">
                <div class="el-form-items">{{params.paramsData.shop.shopName||'无'}}</div>
              </el-form-item>
            </el-col>
          </el-form>
        </el-main>
      </el-container>
    </div>
  </el-dialog>
</template>

<script>
  export default {
    methods: {
      handleClose () {
        this.params.showInfo = false
      }
    },
    props: [
      'params'
    ]
  }
</script>
<style scoped="scoped">
  .addsale-container {
    width: 1200px;
  }

  .addsales-header {
    background: #B3C0D1;
    line-height: 60px;
  }

  .addsales-main {
    padding: 0;
  }

  .none {
    display: none;
  }


  .el-form-item {
    margin-bottom: 10px;
  }
  /*.el-form-items{ width: 150px;}*/

  .el-form-itemt {
    width: 400px;
  }
</style>
